import React from 'react'
import {Input ,Radio ,Select ,Button ,message } from 'antd';
import './index.less';
import axios from 'axios';
import {PATH,IP} from '../../../../../utils/urls';
import {createHashHistory} from "history";
const { Option } = Select;
export default class EditSoftWareResource extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            resouceType: 0,
            appId:"",
            resourceId:"",
            serviceList:[],
            depenceService1:"",
            depenceService2:"",
            depenceService3:"",
            depenceService4:"",
            depenceService5:"",
            depenceService6:""
        };
    }

    componentDidMount() {
        console.log(this.props);
        if(this.props.location.state == null){
            return;
        }
        this.setState({
            appId:this.props.location.state.appId,
        })
        //获取服务资源
        this.getServiceList(this.props.location.state.hardWareId);
    }

    /**
     *获取服务资源
     * @param e
     */
    getServiceList= (id)=>{
        axios.post(PATH.servicePool,{
            hardwareId:id
        }).then(response=>{
            console.log(response);
            if(response.data.code == 0){
                this.setState({
                    serviceList:response.data.data
                })
            }
        })
    }

    onChange = e =>{
        console.log(e.target.value);
        this.setState({
            resouceType: e.target.value,
        });
    }

    handleChange = e=> {
        console.log(e);
    }

    handleChange0 = e=> {
        console.log(e);
        this.state.depenceService1 = this.state.serviceList[e].serviceName;
    }
    handleChange1 = e=> {
        console.log(e);
        this.state.depenceService2 = this.state.serviceList[e].serviceName;
    }
    handleChange2 = e=> {
        console.log(e);
        this.state.depenceService3 = this.state.serviceList[e].serviceName;
    }
    handleChange3 = e=> {
        console.log(e);
        this.state.depenceService4 = this.state.serviceList[e].serviceName;
    }
    handleChange4 = e=> {
        console.log(e);
        this.state.depenceService5 = this.state.serviceList[e].serviceName;
    }
    handleChange5 = e=> {
        console.log(e);
        this.state.depenceService6 = this.state.serviceList[e].serviceName;
    }

    /**
     * 返回
     * @returns {*}
     */
    backFun=()=>{
        let path={
            pathname:"softwaremanager"
        }
        this.props.history.push(path);
    }

    /**
     * 输入框值变化
     * @returns {*}
     */
    inputChange = (event)=>{
        console.log(123);
        if(event && event.target && event.target.value){
            let value = event.target.value;
            switch (event.target.id) {
                case "editSoftWareInput0":
                    this.setState({appId:value});
                    break;
                case "editSoftWareInput1":
                    this.setState({name:value});
                    break;
            }
        }
    }
    /**
     * 保存
     * @returns {*}
     */
    onSubmit=()=>{
        console.log(this.state);
        axios.post(PATH.softwareResourceAdd,{
            resouceType: this.state.resouceType,
            depenceService1:this.state.depenceService1,
            depenceService2:this.state.depenceService2,
            depenceService3:this.state.depenceService3,
            depenceService4:this.state.depenceService4,
            depenceService5:this.state.depenceService5,
            depenceService6:this.state.depenceService6
        }).then(response=>{
            console.log(response);
            if(response.data.code == 0){
                message.success(response.data.msg);
            }else{
                message.error(response.data.msg);
            }
        })
    }
    render() {
        return (
            <div className="changeAllContent">
                <Button onClick={this.backFun} className="backBtn">返回</Button>
                <div className="resourceContentCell">
                    <div className="changeTitle">资源识别(Appid):</div>
                    <Input id="editSoftWareInput0" onChange={event=>this.inputChange(event)} className="changeCell" placeholder="请输入设备标示"/>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">所属设备:</div>
                    <Select className="changeCell" defaultValue="0" onChange={this.handleChange}>
                        <Option value="0">服务器</Option>
                        <Option value="1">客户端</Option>
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">资源类型:</div>
                    <Radio.Group className="changeCell changeRaio" onChange={this.onChange}>
                        <Radio value={0}>服务</Radio>
                        <Radio value={1}>程序</Radio>
                        <Radio value={2}>命令行</Radio>
                    </Radio.Group>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">通讯秘钥::</div>
                    <Input id="editSoftWareInput1" onChange={event=>this.inputChange(event)} className="changeCell" placeholder="请输入通讯秘钥"/>
                </div>

                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务1:</div>
                    <Select id="relyServiceSelect0" className="changeCell" onChange={this.handleChange0}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务2:</div>
                    <Select id="relyServiceSelect1" className="changeCell" onChange={this.handleChange1}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务3:</div>
                    <Select id="relyServiceSelect2" className="changeCell" onChange={this.handleChange2}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务4:</div>
                    <Select id="relyServiceSelect3" className="changeCell" onChange={this.handleChange3}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务5:</div>
                    <Select id="relyServiceSelect4" className="changeCell" onChange={this.handleChange4}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell">
                    <div className="changeTitle">依赖服务6:</div>
                    <Select id="relyServiceSelect5" className="changeCell" onChange={this.handleChange5}>
                        {
                            this.state.serviceList.map((item,index)=>(
                                <Option value={index} key={index}>{item.dispname}</Option>
                            ))
                        }
                    </Select>
                </div>
                <div className="resourceContentCell changeHardBtnDiv">
                    <Button className="changeHardBtn" onClick={this.onSubmit}>保存</Button>
                </div>
                <div className="clearBoth"></div>
            </div>
        )
    }
}